<template>
    <div class='home'>
        <component v-for="(item,index) in modules" :key="index" :is="'ec-'+item.module" :data="item.data" :preview="false"
         :modules-index="index" :shop-id="bStore" v-if="item.module != 'live'">
            {{ item }}
        </component>
        <ec-tab-down></ec-tab-down>
    </div>
</template>
<script>
    //node library
    import url from 'url'
    import qs from 'qs'

    // mapActions mapState
    import {
        mapActions,
        mapState
    } from 'vuex'

    // custom components
    import EcSlide from '@/components/slide/Frontend'
    import EcTitle from '@/components/title/Frontend'
    import EcAnnouncement from '@/components/announcement/Frontend'
    import EcNav from '@/components/nav/Frontend'
    import EcLine from '@/components/line/Frontend'
    import EcBlank from '@/components/blank/Frontend'
    import EcJigsaw from '@/components/jigsaw/Frontend'
    import EcProduct from '@/components/product/Frontend'
    import EcCoupon from '@/components/coupon/Frontend'
    import EcCountDown from '@/components/count-down/Frontend'
    import EcButton from '@/components/button/Frontend'
    import EcSearch from '@/components/search/Frontend'
    import EcStore from '@/components/store/Frontend'
    import EcShopSigns from '@/components/shop-signs/Frontend'
    import EcShopMenu from '@/components/shop-menu/Frontend'
    import EcTabDown from '@/components/tab-down/Frontend'
    import EcFilterTop from '@/components/element/FilterTop'

    export default {
        name: 'home',
        components: {
            EcSlide,
            EcTitle,
            EcAnnouncement,
            EcNav,
            EcLine,
            EcBlank,
            EcJigsaw,
            EcProduct,
            EcCoupon,
            EcCountDown,
            EcButton,
            EcSearch,
            EcStore,
            EcShopSigns,
            EcShopMenu,
            EcTabDown,
            EcFilterTop,
        },
        data() {
            return {
                fromId: ''
            }
        },
        created() {
            this.init(this.$route.params.id)
        },
        methods: {
            init(id) {
                this.modules = []

                this.$store.dispatch('setModuleInfo', {
                    id: id,
                    type: 'topic'
                })
            },
        },
        computed: {
            ...mapState({
                modulesTitle: state => state.pageSetting.title,
            }),
            bStore() {
                return this.$route.params.id ? this.$route.params.id : 0
            },
            modules: {
                get() {
                    return this.$store.state.modules
                },
                set(val) {
                    this.$store.state.modules = val
                }
            }
        },
        watch: {
            '$route'(to, from) {
                this.fromId = from.params.id ? parseInt(from.params.id) : 0;
                console.log(this.fromId)
                this.init(this.fromId)
            },
            modulesTitle() {
                document.title = this.modulesTitle ? this.modulesTitle : this.$t('lang.topicHome');
                let configData = JSON.parse(sessionStorage.getItem('configData'));
                
                this.$wxShare.share({
                    title: document.title,
                    desc: configData.shop_desc,
                    link: window.location.href,
                    imgUrl: configData.wap_logo ? configData.wap_logo : ''
                })
            }
        }
    }
</script>